html,body {
	height: 100%;
	font-size: 14px;
	font-family: "Microsoft yahei","Century Gothic",Arial, sans-serif;
	/* -webkit-filter: grayscale(100%);
	filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1); */
}
body,p,h1,h2,h3,h4,h5,h6,
dl,dt,dd,ul,ol,li,
form,input,textarea,button,
pre,img {
	margin: 0;
	padding: 0;
}
ul,ul li {
	list-style: none;
}
img {
	border: 0;
}
a{
	text-decoration: none;
	color: #333333;
}
a:hover{
	text-decoration: underline;
	color: #000000;
}
a:visited{
	color: #333333;
}
input,textarea,select {
	font-size: 100%;
	outline: 0;
	/*resize: none;*/
	font-family: "Microsoft yahei",Arial,sans-serif;
}
#wrap {
	min-height: 100%;
	height: auto !important;
	height: 100%;
    /*background: purple;*/
	/*margin: 0 auto -150px;
	padding: 0 0 150px;*/
}
header{
    height:120px;
    /*background: #fff;*/
}
.container{
	min-width: 1200px;
	max-width: 1440px;
	margin: 0 auto;
}
#main{
    padding-bottom: 150px;
    /*background: yellow;*/
}
footer {
	height: 150px;
    margin-top: -150px;
	/*background-color: #007200;*/
}
.wrap_box{
	width: 100%;
}
.w100{
	width: 100%;
}
.w90{
	width: 90%;
}
.w80{
	width: 80%;
}
.w75{
	width: 75%;
}
.w70{
	width: 70%;
}
.w66{
	width: 66.66666667%;
}
.w60{
	width: 60%;
}
.w50{
	width: 50%;
}
.w40{
	width: 40%;
}
.w33{
	width: 33.33333333%;
}
.w25{
	width: 25%;
}
.w20{
	width: 20%;
}
.w10{
	width: 10%;
}
.w100,.w90,.w80,.w75,.w70,.w66,.w60,.w50,.w40,.w33,.w25,.w20,.w10{
	box-sizing: border-box;
	float:left;
	padding-left:10px;
	padding-right:10px;
}
.bg-00{
    background: rgba(247, 249, 255, 1);
}
.bg-01{
	background: linear-gradient(90deg,#ffcc99, #ff9900);
}
.bg-02{
	background: linear-gradient(90deg,rgba(102, 204, 204, 1), rgba(0, 102, 102, 1));
}
.bg-03{
	background: linear-gradient(90deg,rgba(51, 204, 102, 1), rgba(0, 102, 0, 1));
}
.bg-04{
	background: linear-gradient(90deg,rgba(0, 204, 255, 1), rgba(0, 102, 204, 1));
}
.bg-05{
	background: linear-gradient(90deg,rgba(255, 255, 204, 1), rgba(255, 204, 0, 1));
}

/* 清除浮动 */
.cl{
	height:10px;
	visibility: hidden;
	overflow:hidden;
	clear:both;
}
.cl20{
	height:20px;
	visibility: hidden;
	overflow:hidden;
	clear:both;
}
.cl50{
	height:50px;
	visibility: hidden;
	overflow:hidden;
	clear:both;
}

/* 清除浮动 */

.sitename{
	text-align: center;
	padding-top: 15px;
	line-height: 40px;
	height: 120px;
	font-size: 1.4em;
	transition: color .5s;
	-webkit-transition: color .5s;
	color: #007200;
}
.sitename:hover{
	color: #ff4757;
	font-weight: bold;
}

#logo{
	height: 100px;
	width: 100px;
	border-radius: 100px;
	overflow: hidden;
	text-align: center;
	margin-top: 10px;
}
.logox:hover{
	-webkit-animation: mymove 2s infinite;
	animation: mymove 2s infinite;
}
@keyframes mymove {
	from{
		-webkit-transform:rotateY(0deg);
		transform:rotateY(0deg);
	}
	to{
		-webkit-transform:rotateY(360deg);
		transform:rotateY(360deg);
	}
}

/*button*/
.button_container{
    /*width: 176px;*/
    margin: 0 auto;
	height: 100px;
    /*margin-top: 30px;*/
    padding-top: 20px;
	/*padding-left: 91px;*/
}

.button_su{
  overflow: hidden;
  position: relative;
  display: inline-block;
  border-radius: 3px;
  margin-bottom: 30px;
}

.su_button_circle{
  background-color: red;
  border-radius: 1000px;
  position: absolute;
  left:0;
  top:0;
  width: 0px;
  height: 0px;
  margin-left: 0px;
  margin-top: 0px;
  pointer-events: none;
  /*animation-timing-function: ease-in-out; */
}

.button_su_inner{
    display: inline-block;
    /*background: #F8B627;*/
	background: #ff9900;
    color: #F4F4F4;
	/*color: #003300;*/
    font-size: 16px;
    font-weight: normal;
    width: 120px;
    text-align: center;
    border-radius: 3px;
    transition: 400ms;
    text-decoration: none;
    padding: 22px;
    z-index: 100000;
}
a.button_su_inner:visited{
	color: #f4f4f4;
}
.button_text_container{
   position:relative;
   z-index: 10000;
}

.explode-circle {
   animation: explode 0.5s forwards;

}

.desplode-circle{
   animation: desplode 0.5s forwards;
}

@keyframes explode {
  0% {
    width: 0px;
    height: 0px;
    margin-left: 0px;
    margin-top: 0px;
    background-color: rgba(42, 53, 80,0.2);
  }
  100% {
    width: 400px;
    height: 400px;
    margin-left: -200px;
    margin-top: -200px;
    background-color: rgba(20, 180, 87,0.8);
  }
}

@keyframes desplode {
  0% {
    width: 400px;
    height: 400px;
    margin-left: -200px;
    margin-top: -200px;
    background-color: rgba(20, 180, 87,0.8);
  }
  100% {
    width: 0px;
    height: 0px;
    margin-left: 0px;
    margin-top: 0px;
    background-color: rgba(129, 80, 108,0.6);
  }
/*button*/